<script setup lang="ts">
import { onMounted } from 'vue'
const props = defineProps<{
  item: {
    deviceNum: string
    isInBed: number
    heart: number
    breath: number
  }
}>()
onMounted(() => {
  console.log(props.item)
})
</script>

<template>
  <view class="whole">
    <!-- <view :class="['address', { offbed: item.isInBed == 0, inbed: item.isInBed === 1 }]"> -->
    <view :class="item.isInBed == 1 ? 'inbed' : 'offbed'" class="address">
      <view class="bed-number">
        <view>{{ item.deviceNum }}</view>
        <view>床位号</view>
      </view>
      <view class="data">
        <view class="heart">
          <image src="@/static/heart.png" mode="aspectFit" />

          <view>
            {{ item.heart == 0 ? '--' : `${item.heart}` }}
          </view>
        </view>
        <view class="breathe">
          <image src="@/static/breath.png" mode="aspectFit" />
          <view>
            {{ item.breath == 0 ? '--' : `${item.breath}` }}
          </view>
        </view>
      </view>
    </view>
    <view :class="item.isInBed == 1 ? 'statusInbed' : 'statusOffbed'"></view>
  </view>
</template>
<style lang="scss"></style>
